//组件结构
<template>
  <div class="demo">
    <h2>学生姓名:{{ name }}</h2>
    <h2>学生年龄:{{ age }}</h2>
  </div>
</template>

//组件交互
<script>
//Vue.extend()可以省略
export default {
  name: 'Student',
  data() {
    return {
      name: daidawang,
      age: 18
    }
  }
};
// 为了实现组件化, 即别人可以用Import引入,需要对school组件化
//共有三种暴露方式
//1.单点暴露 export const school = Vue.extend({})   引入格式 Import {school} from './MySchool'
//2.同一暴露 export {school}                        引入格式 Import {school} from './MySchool'
//3.默认暴露 export default school                  引入格式 Import school from './MySchool'

</script>

//组件的样式
<style>
  .demo {
    background-color: skyblue;
  }
</style>